<template xmlns="http://www.w3.org/1999/html">
  <div class="bg">


    <el-row>
      <div class="avatar-shape">

        <el-row>
          <el-col :span="20">
            <el-row style="align-items: center">
              <div style="font-size: 20px; color: rgba(0,0,0,0.85)" v-html="eventTitle"></div>
            </el-row>

            <el-row>
              <span style="margin-right: 10px;color: black">监测周期：{{ startTime }} -- {{ endTime }}</span>
              <el-tag size="mini" type="success" v-if="endTimeLong > new Date().getTime()">监测中</el-tag>
              <el-tag size="mini" v-else type="danger">已结束</el-tag>
            </el-row>

            <el-row>
              <span style="color: black">关键字：</span>
              <el-tag type="info" style="margin: 5px" v-for="(item, index) in tags" :key="index">
                <span v-html="item">

                </span>

              </el-tag>
            </el-row>
          </el-col>
          <el-col :span="4">
            <div style="margin-top: 20px">
              <el-button type="primary" @click="previewReport" size="mini">生成报告(预览)</el-button>
            </div>
          </el-col>
        </el-row>

      </div>


    </el-row>

    <el-row>

      <el-col :span="4" style="margin-top: 10px">

        <el-menu
          default-active="1"
          class="el-menu-vertical-demo"
          @select="handleSelect"
          @open="handleOpen"
          @close="handleClose">

          <el-menu-item index="1">
            <i class="el-icon-location"></i>
            <span slot="title">事件脉络</span>
          </el-menu-item>
          <el-menu-item index="2">
            <i class="el-icon-menu"></i>
            <span slot="title">发展趋势</span>
          </el-menu-item>
          <el-menu-item index="3">
            <i class="el-icon-document"></i>
            <span slot="title">传播演化</span>
          </el-menu-item>
          <el-menu-item index="4">
            <i class="el-icon-mic"></i>
            <span slot="title">舆论分析</span>
          </el-menu-item>
          <el-menu-item index="5">
            <i class="el-icon-user"></i>
            <span slot="title">参与者分析</span>
          </el-menu-item>
          <el-menu-item index="6">
            <i class="el-icon-place"></i>
            <span slot="title">影响范围</span>
          </el-menu-item>
        </el-menu>

      </el-col>

      <el-col :span="20" style="padding-left: 10px;margin-top: 10px" v-if="showLayout==6">

        <div class="box">
          <ModuleHeader :title="optionTitleTextLocation"/>
          <div class="box_div">
            <graph-force-layout
              :height="height"
              :categories="categoriesLocation"
              :nodes="nodesLocation"
              :links="linksLocation"
            />
          </div>
        </div>
        <div class="box">
          <ModuleHeader :title="optionTitleTextPerson"/>
          <div class="box_div">
            <graph-force-layout
              :height="height"

              :categories="categoriesPerson"
              :nodes="nodesPerson"
              :links="linksPerson"
            />
          </div>
        </div>
        <div class="box">
          <ModuleHeader :title="optionTitleTextOrganization"/>
          <div class="box_div">
            <graph-force-layout
              :height="height"

              :categories="categoriesOrganization"
              :nodes="nodesOrganization"
              :links="linksOrganization"
            />
          </div>
        </div>




      </el-col>

      <el-col :span="20" style="padding-left: 10px;margin-top: 10px" v-if="showLayout==5">

        <div class="box">
          <ModuleHeader :title="optionTitleTextMediaNameEmotion"/>
          <div class="box_div">
            <bar-chart-data-set
              :height="height"
              :opinionDatasetDimensions="opinionDatasetDimensionsMediaNameEmotion"
              :opinionDatasetSource="opinionDatasetSourceMediaNameEmotion"
            />
          </div>
        </div>

        <div class="box">
          <ModuleHeader :title="optionTitleTextAuthorEmotion"/>
          <div class="box_div">
            <bar-chart-data-set
              :height="height"
              :opinionDatasetDimensions="opinionDatasetDimensionsAuthorEmotion"
              :opinionDatasetSource="opinionDatasetSourceAuthorEmotion"
            />
          </div>
        </div>




      </el-col>

      <el-col :span="20" style="padding-left: 10px;margin-top: 10px" v-if="showLayout==4">

        <div class="box">
          <ModuleHeader :title="optionTitleTextMediaTypeEmotion"/>
          <div class="box_div">
            <bar-chart-data-set
              :height="height"
              :opinionDatasetDimensions="opinionDatasetDimensionsMediaTypeEmotion"
              :opinionDatasetSource="opinionDatasetSourceMediaTypeEmotion"
            />
          </div>
        </div>

        <div class="box">
          <ModuleHeader :title="optionTitleTextHotWords"/>
          <div class="box_div">
            <word-cloud :hots="hotWords"
                        :height="height"
                         />
          </div>
        </div>

        <div class="box">
          <ModuleHeader :title="'观点分析'"/>
          <div class="box_div" style="height: 100%">
            <viewpoint-analysis :viewpoints="viewpoints"
                                :positiveNum="positiveNum"
                                :negativeNum="negativeNum"
                                :sum="sumNum"
            />
          </div>
        </div>


      </el-col>

      <el-col :span="20" style="padding-left: 10px;margin-top: 10px" v-if="showLayout==3">

        <div class="box">
          <ModuleHeader :title="'首发媒体溯源'"/>
          <div class="box_div" style="padding: 0">
            <el-table v-loading="loading" :data="startingMedia">
              <el-table-column label="媒体类型" align="center" prop="carrie" width="100"/>
              <el-table-column label="发布时间" align="center" prop="publishTime" width="160">
                <template slot-scope="scope">
                  <span>{{ scope.row.publishTime}}</span>
                </template>
              </el-table-column>
              <el-table-column label="标题" width="500">
                <template slot-scope="scope">
                  <el-link @click="GotoDetail(scope.row.id)"
                           style="color: #1f86d9;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: inline-block;width: 100%;">
                    {{scope.row.title}}
                  </el-link>
                </template>
              </el-table-column>
              <el-table-column label="信息来源" align="center">
                <template slot-scope="scope">
                  <el-link :href="scope.row.url" target="_blank">
                    {{scope.row.siteName}}
                  </el-link>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>

        <div class="box">
          <ModuleHeader :title="'媒体传播分析'"/>
          <div class="box_div">
            <MediaNameTrend
              :eventId="eventId"
            ></MediaNameTrend>
          </div>
        </div>




      </el-col>

      <el-col :span="20" style="padding-left: 10px;margin-top: 10px" v-if="showLayout==2">

        <div class="box">
          <ModuleHeader :title="'正负面信息趋势图'"/>
          <div class="box_div">
            <LineChart
              :height="height"
              :optionLegend="optionLegendSentiments"
              :optionSeries="optionSeriesSentiments"
              :optionXAxisData="optionXAxisDataSentiments"
              :color="sentimentsColor"/>
          </div>
        </div>


        <div class="box">
          <ModuleHeader :title="'信息载体趋势图'"/>
          <div class="box_div">
            <line-chart :height="height"
                        :optionSeries="optionSeriesMediaType"
                        :optionXAxisData="optionXAxisDataMediaType"

                        :optionLegend="optionLegendMediaType"
            />
          </div>
        </div>

        <div class="box">
          <ModuleHeader :title="'近七日负面信息热力图'"/>
          <div class="box_div">
            <InformationHeatMap :eventId="this.eventId"></InformationHeatMap>
          </div>
        </div>


      </el-col>

      <el-col :span="20" style="padding-left: 10px" v-if="showLayout==1">


        <div class="search-shape">

          <el-collapse>
            <el-collapse-item title="筛选条件" name="1">
              <el-row>

                <el-col :span="12">
                  <div style="font-size: 14px; margin-top: 10px">
                    监测时间:
                    <el-radio-group size="small" v-model="timeType" @change="onChangeGroup">
                      <el-radio-button v-for="(option, index) in options" :key="index"
                                       :label="option.value">{{option.label}}
                      </el-radio-button>
                    </el-radio-group>

                    <el-date-picker
                      @change="onPickDate"
                      value-format="yyyy-MM-dd"
                      style="margin-left: 10px"
                      v-if="showSelectData"
                      v-model="value1"
                      type="daterange"
                      range-separator="至"
                      start-placeholder="开始日期"
                      end-placeholder="结束日期">
                    </el-date-picker>

                  </div>
                </el-col>

                <el-col :span="12">
                  <div style="font-size: 14px; margin-top: 10px">
                    信息排序:
                    <el-radio-group size="small" v-model="selectSort" @change="onChangeGroupSort">
                      <el-radio-button v-for="(option, index) in sortOptions" :key="index"
                                       :label="option.dictValue">
                        {{option.dictLabel}}
                      </el-radio-button>
                    </el-radio-group>
                  </div>
                </el-col>

                <el-col :span="12">
                  <div style="font-size: 14px; margin-top: 10px">
                    信息属性:
                    <el-radio-group size="small" v-model="selectEmotion" @change="onChangeGroupEmotion">
                      <el-radio-button v-for="(option, index) in emotionOptions" :key="index"
                                       :label="option.dictValue">
                        {{option.dictLabel}}
                      </el-radio-button>
                    </el-radio-group>
                  </div>

                </el-col>

              </el-row>


            </el-collapse-item>
          </el-collapse>

        </div>


        <el-row style="background-color: white;padding: 10px;margin-top: 10px">
          <el-col :span="3" style="margin: 6px 0">
            <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">
              全部
            </el-checkbox>
          </el-col>
          <el-checkbox-group v-model="checkList" @change="handleCheckedMediaTypeChange">
            <el-col :span="3" style="margin: 6px 0" v-for="(item, index) in checks" :key="index">
              <el-checkbox :label="item.dictValue" :value="item.dictValue">{{item.dictLabel}}
                <span style="color: #0C71E0">
                       ({{getCount(item.dictValue)}})
                    </span>
              </el-checkbox>
            </el-col>
          </el-checkbox-group>
        </el-row>


        <div class="event-shape">
          <div class="handle-nav">
            <div style="width: 400px; display: flex; justify-content: space-between; align-items: center">
              <el-dropdown trigger="click">
                <div style="display: flex; align-items: center; cursor: pointer">
                  <img src="../../assets/images/research.svg" style="width: 20px; height: 20px"/>
                  <div style="margin-left: 7.5px">研判为</div>
                </div>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item @click.native="setSensitiveInformationByPelople('正面')">
                    正面
                  </el-dropdown-item>
                  <el-dropdown-item @click.native="setSensitiveInformationByPelople('中性')">
                    中性
                  </el-dropdown-item>
                  <el-dropdown-item @click.native="setSensitiveInformationByPelople('负面')">
                    负面
                  </el-dropdown-item>
                  <!--                  <el-dropdown-item @click.native="setSensitiveInformationByPelople('删除')">-->
                  <!--                    与我无关（删除）-->
                  <!--                  </el-dropdown-item>-->
                </el-dropdown-menu>
              </el-dropdown>
              <el-dropdown trigger="click">
                <div style="display: flex; align-items: center;cursor: pointer;">
                  <img src="../../assets/images/warning.svg" style="width: 20px; height: 20px"/>
                  <div style="margin-left: 7.5px">加入预警</div>
                </div>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item @click.native="setForecastMultiple('red')">
                    红色预警
                  </el-dropdown-item>
                  <el-dropdown-item @click.native="setForecastMultiple('orange')">
                    橙色预警
                  </el-dropdown-item>
                  <el-dropdown-item @click.native="setForecastMultiple('yellow')">
                    黄色预警
                  </el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>

              <div style="display: flex; align-items: center">
                <img src="../../assets/images/educe.svg" style="width: 20px; height: 20px"/>
                <el-button type="text" style="margin-left: 7.5px" :loading="exportLoading" @click="handleExport">导出文章
                </el-button>
              </div>
              <div style="display: flex; align-items: center">
                <img src="../../assets/images/store.svg" style="width: 20px; height: 20px"/>
                <el-button type="text" style="margin-left: 7.5px" @click="addToFavoritesMultiple">加入收藏
                </el-button>
              </div>
            </div>
            <div style="width: 600px; display: flex; justify-content: space-between; align-items: center">
              <div style="display: flex; align-items: center;margin-left: 20px">
                <img src="../../assets/images/hidden.svg" style="width: 20px; height: 20px"/>
                <el-button type="text" style="margin-left: 7.5px" @click="hiddenAbstractFunc">隐藏摘要
                </el-button>
              </div>
              <el-checkbox @change="dataDuplicateRemoval" style="margin-left: 20px">数据排重</el-checkbox>

              <el-input placeholder="请输入内容" v-model="detailInput" style="margin-left: 20px;width: 400px">
                <el-select v-model="detailSelect" slot="prepend" placeholder="请选择" style="width: 130px">
                  <el-option
                    v-for="dict in searchAreaOptions"
                    :key="dict.dictValue"
                    :label="dict.dictLabel"
                    :value="dict.dictValue"
                  />
                </el-select>
                <el-button slot="append" icon="el-icon-search" @click="search"/>
              </el-input>

            </div>
          </div>
          <div style="display: flex; justify-content: space-between">
            <div style="width: 100%">
              <el-table v-loading="loading" :data="events" @selection-change="handleSelectionChange" stripe>
                <el-table-column type="selection" width="50" align="center"/>
                <el-table-column label="发布时间" width="160" align="center" prop="publishTime"/>
                <el-table-column label="" width="50" align="left">
                  <template slot-scope="scope">
                    <div style="text-align: center; ">
                      <div>
                        <el-avatar size="small" v-if="scope.row.ispositive === 1" style="background-color: #67C23A"> 正
                        </el-avatar>
                        <el-avatar size="small" v-else-if="scope.row.isnegative === 1"
                                   style="background-color: #F56C6C"> 负
                        </el-avatar>
                        <el-avatar size="small" v-else-if="scope.row.isneutral === 1" style="background-color: #409EFF">
                          中
                        </el-avatar>
                        <el-avatar size="small" v-else style="background-color: #909399"> 无
                        </el-avatar>
                      </div>
                      <div style="height: 80px;width: 1px;background-color: #8d989d;display: inline-block"/>
                    </div>
                  </template>
                </el-table-column>
                <el-table-column label="标题" align="center">
                  <template slot-scope="scope">
                    <div>

                      <div style="display: flex">
                        <div
                          v-html="scope.row.title"
                          @click="GotoDetail(scope.row.id)"
                          class="title_text">
                        </div>
                        <span v-if="scope.row.siteName!=null" style="margin-left: 10px;font-size: 16px;color: #3c7af9">
                            [{{scope.row.siteName}}]
                        </span>
                        <div style="margin-left: 10px">
                          <el-tag effect="dark"
                                  size="mini" type="danger"
                                  v-if="scope.row.level=='red'">
                            红色预警
                          </el-tag>
                          <el-tag effect="dark"
                                  size="mini" type="warning"
                                  v-if="scope.row.level=='orange'">
                            橙色预警
                          </el-tag>
                          <el-tag color="yellow"
                                  effect="light" size="mini"
                                  v-if="scope.row.level=='yellow'">
                            黄色预警
                          </el-tag>
                        </div>
                      </div>

                      <div v-if="hiddenAbstract" v-html="scope.row.content" @click="GotoDetail(scope.row.id)"
                           class="content_text">
                      </div>

                      <div style="float: right;display: flex; align-items: center; font-size: 12px;">
                        <div style="display: flex; align-items: center" @click="addToFavorites(scope.row)">
                          <img src="../../assets/images/store.svg"
                               style="width: 16px; height: 16px"/>加入收藏
                        </div>
                        <el-divider direction="vertical"/>
                        <el-dropdown trigger="click" style="font-size: 12px">
                          <div style="display: flex; align-items: center; cursor: pointer">
                            <img src="../../assets/images/research.svg"
                                 style="width: 16px; height: 16px"/>研判为
                          </div>
                          <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item
                              @click.native="setSensitiveInformationBySigle(scope.row, '正面')">
                              正面
                            </el-dropdown-item>
                            <el-dropdown-item
                              @click.native="setSensitiveInformationBySigle(scope.row, '中性')">
                              中性
                            </el-dropdown-item>
                            <el-dropdown-item
                              @click.native="setSensitiveInformationBySigle(scope.row, '负面')">
                              负面
                            </el-dropdown-item>
                            <!--<el-dropdown-item
                              @click.native="setSensitiveInformationBySigle(scope.row, '删除')">
                              与我无关（删除）
                            </el-dropdown-item>-->
                          </el-dropdown-menu>
                        </el-dropdown>
                        <el-divider direction="vertical"/>
                        <el-dropdown trigger="click" style="font-size: 12px">
                          <div style="display: flex; align-items: center">
                            <img src="../../assets/images/warning.svg" style="width: 16px; height: 16px"/>加入预警
                          </div>
                          <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item
                              @click.native="setForecastSigle(scope.row, 'red')">
                              红色预警
                            </el-dropdown-item>
                            <el-dropdown-item
                              @click.native="setForecastSigle(scope.row, 'orange')">
                              橙色预警
                            </el-dropdown-item>
                            <el-dropdown-item
                              @click.native="setForecastSigle(scope.row, 'yellow')">
                              黄色预警
                            </el-dropdown-item>
                          </el-dropdown-menu>
                        </el-dropdown>
                      </div>

                    </div>
                  </template>
                </el-table-column>
              </el-table>
              <el-pagination style="text-align: center"
                             @size-change="handleSizeChange"
                             @current-change="handleCurrentChange"
                             :current-page="pageParams.pageNum"
                             :page-sizes="[10, 20, 50, 100]"
                             :page-size="10"
                             layout="total, sizes, prev, pager, next, jumper"
                             :total="opinionTotal">
              </el-pagination>
            </div>
          </div>
        </div>

      </el-col>


    </el-row>


  </div>
</template>

<script>
  import {
    updateSensitiveInformation,
    joinTheForecast,
    generateReportByEventId,
    unbindOpinionForEvent,
    updateEvents,
    queryByEventParameter,
    getSentimentByPublishTimeByEventId,
    getMediaTypeByPublishTimeByEventId,
    getFirstMediaReleasedByEventId,
    getMediaTypeSensitiveDayNumEvent,
    countSensitiveOpinionByMediaName,
    countSensitiveAuthorOpinion,
    getKeywordsByEventId,
    getViewpointAnalysis,
    getPersonsByEventId,
    getLocationsByEventId,
    getOrganizationsByEventId
  } from "@/api/system/event";
  import {exportOpinionByIds, addToFavorites} from "@/api/system/opinion";
  import LineChart from '@/components/Echarts/LineChart'
  import HeatMap from '@/components/Echarts/HeatMap'
  import LineChartStyle from '@/components/Echarts/LineChartStyle'
  import WordCloud from '@/components/Echarts/WordCloud'
  import BarChartDataSet from '@/components/Echarts/BarChartDataSet'
  import GraphForceLayout from '@/components/Echarts/GraphForceLayout'
  import ViewpointAnalysis from './ViewpointAnalysis'
  import LineChartSections from '@/components/Echarts/LineChartSections'
  import MediaNameTrend from '@/components/Custom/ReportElement/MediaNameTrend'
  import InformationHeatMap from '@/components/Custom/InformationHeatMap'
  import ModuleHeader from '@/views/components/ModuleHeader'

  export default {
    data() {
      return {
        selectSort: 'desc',
        sortOptions: [{"dictLabel": "时间降序", "dictValue": "desc"}, {"dictLabel": "时间升序", "dictValue": "asc"}],
        subscribe: 0,
        repeatState: false,
        options: [
          {label: '全部', value: 'all'},
          {label: '今天', value: 'today'},
          {label: '昨天', value: 'yesterday'},
          {label: '近7天', value: 'week'},
          {label: '近30天', value: 'month'},
          {label: '自定义', value: 'define'},
        ],
        timeType: 'all',
        value1: '',
        selectEmotion: '',
        showSelectData: false,

        optionTitleTextLocation: "关联地域分析",
        categoriesLocation: [],
        nodesLocation: [],
        linksLocation: [],

        optionTitleTextPerson: "关联人物分析",
        categoriesPerson: [],
        nodesPerson: [],
        linksPerson: [],


        optionTitleTextOrganization: "关联机构分析",
        categoriesOrganization: [],
        nodesOrganization: [],
        linksOrganization: [],


        opinionDatasetDimensionsMediaNameEmotion: [],
        opinionDatasetSourceMediaNameEmotion: [],
        optionTitleTextMediaNameEmotion: '',

        opinionDatasetDimensionsAuthorEmotion: [],
        opinionDatasetSourceAuthorEmotion: [],
        optionTitleTextAuthorEmotion: '',

        opinionDatasetDimensionsMediaTypeEmotion: [],
        opinionDatasetSourceMediaTypeEmotion: [],
        optionTitleTextMediaTypeEmotion: '',

        optionTitleTextHotWords: "热词云图",
        hotWords: [{name: "暂无数据", value: 1}],

        startingMedia: [],

        optionLegendSentiments: ["正面", "中性", "负面"],
        optionSeriesSentiments: [],
        optionXAxisDataSentiments: [],
        sentimentsColor: [
          "green",
          "gray",
          "red"
        ],

        optionSeriesMediaType: [],
        optionXAxisDataMediaType: [],
        optionLegendMediaType: [],

        height: "400px",
        showLayout: 1,
        // 导出遮罩层
        exportLoading: false,
        generateLoading: false,
        loading: false,
        sum: 0,
        isIndeterminate: true,
        checkAll: true,
        tags: [],
        checks: [],
        eventId: 0,
        checkList: [],
        opinionTotal: 0,
        events: [],
        detailInput: '',
        detailSelect: 'all',
        sensitiveInformation: '',
        ids: [],
        emotionOptions: [],
        searchAreaOptions: [],
        queryParams: {
          //自定义选择的日期
          startDateTime: null,
          endDateTime: null,
        },
        pageParams: {
          pageNum: 1,
          pageSize: 10,
        },
        keyWords: '',
        eventTitle: '',
        incidentType: '',
        hiddenAbstract: true,
        startTime: null,
        endTime: null,
        endTimeLong: 0,
        downloadUrl: null,
        viewpoints: [],
        positiveNum: 0,
        negativeNum: 0,
        sumNum: 0,
        disposalSuggestions: '暂无',
        carrieCounts: []

      }
    },
    components: {
      LineChartSections,
      LineChart,
      HeatMap,
      LineChartStyle,
      WordCloud,
      BarChartDataSet,
      GraphForceLayout,
      ViewpointAnalysis,
      MediaNameTrend,
      InformationHeatMap,
      ModuleHeader
    },
    created() {
      this.getDicts("media_type").then(response => {
        this.checks = response.data;
      });
      this.getDicts("emotional_characteristics").then(response => {
        this.emotionOptions = response.data;
        let all = {
          dictValue: '',
          dictLabel: '全部'
        }
        this.emotionOptions.unshift(all);
      });
      this.keyWords = this.$route.query.relatedWords
      this.tags.push(this.keyWords);
      this.eventId = Number(this.$route.query.eventId)
      this.eventTitle = this.$route.query.eventTitle
      this.startTime = this.$route.query.startTime
      this.endTime = this.$route.query.endTime
      this.endTimeLong = new Date(this.endTime).getTime()
      this.subscribe = this.$route.query.subscribe
      this.incidentType = this.$route.query.incidentType
      //下钻传递的参数
      this.detailInput = this.$route.query.detailInput

      if (this.$route.query.timeType != null) {
        this.timeType = this.$route.query.timeType
      }

      this.showSelectData = this.timeType == "define" ? true : false
      this.queryParams.startDateTime = this.$route.query.beginPublishDay
      this.queryParams.endDateTime = this.$route.query.endPublishDay
      if (this.queryParams.startDateTime != null && this.queryParams.endDateTime) {
        this.value1 = this.$route.query.value1
      }
      if (this.$route.query.selectEmotion != null) {
        this.selectEmotion = this.$route.query.selectEmotion
      }
      if (this.$route.query.selectMediaType != null) {
        this.checkList.push(this.$route.query.selectMediaType)
      }
      this.getDicts("search_area_options").then(response => {
        this.searchAreaOptions = response.data;
      });
      this.getOption()
      this.getSentimentByPublishTimeByEventId()
      this.getMediaTypeByPublishTimeByEventId()
      this.getFirstMediaReleasedByEventId()
      this.getMediaTypeSensitiveDayNumEvent()
      this.countSensitiveOpinionByMediaName()
      this.countSensitiveAuthorOpinion()
      this.getKeywordsByEventId()
      this.getViewpointAnalysis()
      this.getPersonsByEventId()
      this.getLocationsByEventId()
      this.getOrganizationsByEventId()
    },
    methods: {
      getCount(carrie) {
        let count = 0
        this.carrieCounts.forEach(item => {
          if (item.name == carrie) {
            count = item.value
          }
        })
        return count
      },
      getPersonsByEventId() {
        getPersonsByEventId({
          eventId: this.eventId,
        }).then(response => {
          let arrays = response.rows
          let nodes = [{name: '关联人物'}]
          let links = []
          arrays.forEach(item => {
            let node = {
              name: item.name
            }
            nodes.push(node)
            let link = {
              source: '关联人物', target: item.name
            }
            links.push(link)
          })
          this.nodesPerson = nodes
          this.linksPerson = links

        });
      },
      getLocationsByEventId() {
        getLocationsByEventId({
          eventId: this.eventId,
        }).then(response => {
          let arrays = response.rows
          let nodes = [{name: '关联地域'}]
          let links = []
          arrays.forEach(item => {
            let node = {
              name: item.name
            }
            nodes.push(node)
            let link = {
              source: '关联地域', target: item.name
            }
            links.push(link)
          })
          this.nodesLocation = nodes
          this.linksLocation = links
        });
      },
      getOrganizationsByEventId() {
        getOrganizationsByEventId({
          eventId: this.eventId,
        }).then(response => {
          let arrays = response.rows
          let nodes = [{name: '关联机构'}]
          let links = []
          arrays.forEach(item => {
            let node = {
              name: item.name
            }
            nodes.push(node)
            let link = {
              source: '关联机构', target: item.name
            }
            links.push(link)
          })
          this.nodesOrganization = nodes
          this.linksOrganization = links
        });
      },
      getViewpointAnalysis() {
        getViewpointAnalysis({
          eventId: this.eventId,
        }).then(response => {
          //观点
          this.viewpoints = response.data
          let positive = 0.0
          let negative = 0.0
          this.viewpoints.forEach(item => {
            if (item.ispositive === 1) {
              positive += 1
            } else if (item.isnegative === 1) {
              negative += 1
            }
          })
          this.positiveNum = positive / this.viewpoints.length * 100
          this.positiveNum = Number(this.positiveNum.toFixed(2))
          this.negativeNum = negative / this.viewpoints.length * 100
          this.negativeNum = Number(this.negativeNum.toFixed(2))
          this.sumNum = this.viewpoints.length
        });
      },
      getKeywordsByEventId() {
        getKeywordsByEventId({
          eventId: this.eventId,
        }).then(response => {
          if (response.rows != undefined && response.rows.length > 0) {
            this.hotWords = response.rows;
          } else {
            this.hotWords = [{name: "暂无数据", value: 1}];
          }
          console.log(this.hotWords)
        });
      },
      countSensitiveOpinionByMediaName() {
        countSensitiveOpinionByMediaName({
          eventId: this.eventId,
        }).then(response => {
          let mediaNameSensitive = response.rows
          this.opinionDatasetDimensionsMediaNameEmotion = ["媒体名称", "正面", "负面", "中性"]
          mediaNameSensitive.forEach(m => {
            this.opinionDatasetSourceMediaNameEmotion.push([m.mediaName, m.positive, m.negative, m.neutral])
          })
          this.optionTitleTextMediaNameEmotion = '媒体活跃排行榜'

        });
      },
      countSensitiveAuthorOpinion() {
        countSensitiveAuthorOpinion({
          eventId: this.eventId,
        }).then(response => {
          let authorRank = response.rows
          this.opinionDatasetDimensionsAuthorEmotion = ["媒体名称", "正面", "负面", "中性"]
          authorRank.forEach(m => {
            this.opinionDatasetSourceAuthorEmotion.push([m.author, m.positive, m.negative, m.neutral])
          })
          this.optionTitleTextAuthorEmotion = '意见领袖榜'

        });
      },


      getMediaTypeSensitiveDayNumEvent() {
        getMediaTypeSensitiveDayNumEvent({
          eventId: this.eventId,
        }).then(response => {
          let mediaTypeSensitive = response.rows
          this.opinionDatasetDimensionsMediaTypeEmotion = ["媒体类型", "正面", "负面", "中性"]
          mediaTypeSensitive.forEach(m => {
            let count1 = 0
            m.value.forEach(v => {
              if (v.name === 'ispositive') {
                count1 = v.value
              }
            })
            let count2 = 0
            m.value.forEach(v => {
              if (v.name === 'isneutral') {
                count2 = v.value
              }
            })

            let count3 = 0
            m.value.forEach(v => {
              if (v.name === 'isnegative') {
                count3 = v.value
              }
            })
            this.opinionDatasetSourceMediaTypeEmotion.push([m.name, count1, count3, count2])
          })
          this.optionTitleTextMediaTypeEmotion = '载体情感分析图'

        });
      },
      getFirstMediaReleasedByEventId() {
        getFirstMediaReleasedByEventId({
          eventId: this.eventId,
        }).then(response => {
          this.startingMedia = response.rows
        });
      },
      getMediaTypeByPublishTimeByEventId() {
        getMediaTypeByPublishTimeByEventId({
          eventId: this.eventId,
        }).then(response => {
          //信息载体趋势图
          this.optionSeriesMediaType = []
          this.optionXAxisDataMediaType = []
          this.optionLegendMediaType = []
          let list = response.rows
          var xAxisData = [];
          var legendData = [];
          var seriesData = [];

// 获取legendData
          for (var i = 0; i < list.length; i++) {
            var row = list[i];
            // 添加日期到xAxisData数组
            xAxisData.push(row.name);
            // 获取legendData
            for (var j = 0; j < row.value.length; j++) {
              var value = row.value[j];
              // 添加value.name到legendData数组
              if (!legendData.includes(value.name)) {
                legendData.push(value.name);
              }
            }
          }

          // 遍历list数组
          for (var i = 0; i < list.length; i++) {
            var row = list[i];
            for (let k = 0; k < legendData.length; k++) {
              //获取媒体类型
              let mediaName=legendData[k];

              // 查找对应的series对象
              var getMediaName = row.value.find(function (obj) {
                return obj.name === mediaName;
              });

              if (!getMediaName) {
                let obj={
                  name:mediaName,
                  value:0
                }
                row.value.push(obj)
              }
            }

            // 遍历row.value数组
            for (let j = 0; j < row.value.length; j++) {
              let value = row.value[j];

              // 查找对应的series对象
              let seriesObj = seriesData.find(function (obj) {
                return obj.name === value.name;
              });

              // 如果找不到对应的series对象，则创建一个新的series对象
              if (!seriesObj) {
                seriesObj = {
                  name: value.name,
                  type: 'line',
                  data: []
                };
                seriesData.push(seriesObj);
              }
              // 添加value.value到seriesObj的data数组中
              seriesObj.data.push(value.value);
            }


          }

// 创建series数组
          var series = [];
          for (var i = 0; i < seriesData.length; i++) {
            var data = seriesData[i];

            // 创建series对象
            var seriesObj = {
              name: data.name,
              type: 'line',
              // stack: 'Total',
              data: data.data
            };

            // 将seriesObj添加到series数组中
            series.push(seriesObj);
          }

          console.log("媒体：",xAxisData);
          console.log("媒体：",legendData);
          console.log("媒体：",series);

          this.optionSeriesMediaType = series
          this.optionXAxisDataMediaType = xAxisData
          this.optionLegendMediaType = legendData

        });
      },
      getSentimentByPublishTimeByEventId() {
        getSentimentByPublishTimeByEventId({
          eventId: this.eventId,
        }).then(response => {
          this.optionSeriesSentiments = []
          this.optionXAxisDataSentiments = []
          let list = response.rows
          let zm = {
            name: '正面',
            type: 'line',
            data: [],

          }
          let zx = {
            name: '中性',
            type: 'line',
            data: [],

          }
          let fm = {
            name: '负面',
            type: 'line',
            data: [],

          }
          let zmlist = []
          let zxlist = []
          let fmlist = []
          list.forEach(item => {
            this.optionXAxisDataSentiments.push(item.name);
            let zmnum = 0
            let zxnum = 0
            let fmnum = 0
            item.value.forEach(i => {
              if (i.name == 'ispositive') {
                zmnum = i.value
              }
              if (i.name == 'isneutral') {
                zxnum = i.value
              }
              if (i.name == 'isnegative') {
                fmnum = i.value
              }
            })
            zmlist.push(zmnum)
            zxlist.push(zxnum)
            fmlist.push(fmnum)
          })
          zm.data = zmlist
          zx.data = zxlist
          fm.data = fmlist
          this.optionSeriesSentiments.push(zm)
          this.optionSeriesSentiments.push(zx)
          this.optionSeriesSentiments.push(fm)

        });
      },
      previewReport() {
        this.$router.push({path: '/report/preview', query: {eventId: this.eventId}});
      },
      subscribeReport() {
        this.subscribe = this.subscribe != 1 ? 1 : 0
        let event = {
          eventId: this.eventId,
          subscribe: this.subscribe,
        }
        updateEvents(event).then(response => {
          this.$message({
            showClose: true,
            message: this.subscribe == 1 ? '订阅简报成功' : '取消订阅简报成功',
            type: 'success'
          })
        }).catch(() => {
          this.$message({
            showClose: true,
            message: '操作失败！',
            type: 'warning'
          })
        })
      },
      dataDuplicateRemoval(value) {
        this.repeatState = value;
        this.getOption();
      },
      GotoDetail(id) {
        this.$router.push({path: '/opinion/detail', query: {id: id}});
      },
      onChangeGroup() {
        this.showSelectData = this.timeType == "define" ? true : false
        if (this.timeType !== "define") {
          this.getOption();
        }
      },
      onChangeGroupEmotion() {
        this.getOption();
      },
      onChangeGroupSort() {
        this.getOption();
      },
      onPickDate(value) {
        console.log(value[0], value[1])
        this.queryParams.startDateTime = value[0]
        this.queryParams.endDateTime = value[1]
        this.getOption()

      },

      handleSelect(key, keyPath) {
        console.log("handleSelect", key, keyPath);
        this.showLayout = key;
      },
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      },
      addToFavoritesMultiple() {
        if (this.ids.length === 0) {
          this.$message({
            showClose: true,
            message: '请选择文章',
            type: 'warning'
          })
          return
        }
        const queryParams = {
          ids: this.ids,
        };
        addToFavorites(queryParams).then(response => {
          this.$message({
            showClose: true,
            message: '加入收藏成功',
            type: 'success'
          })
        })

      },
      addToFavorites(row) {
        const queryParams = {
          ids: row.id,
        };
        addToFavorites(queryParams).then(response => {
          this.$message({
            showClose: true,
            message: '加入收藏成功',
            type: 'success'
          })
        })
      },
      generateReport() {
        if (this.opinionTotal === 0) {
          this.$message({
            showClose: true,
            message: '当前事件没有任何舆情，生成报告中止',
            type: 'warning'
          })
          return
        }
        this.generateLoading = true;
        generateReportByEventId(this.eventId).then(response => {
          this.generateLoading = false;
          this.$message.success(response.msg);
          //this.downloadUrl = process.env.VUE_APP_BASE_API + "/profile/" + response.msg;
          //window.open(this.downloadUrl);
        }).catch(() => {
          this.generateLoading = false;
        })
      },
      hiddenAbstractFunc() {
        this.hiddenAbstract = this.hiddenAbstract === true ? false : true
      },


      /** 导出按钮操作 */
      handleExport() {
        if (this.ids.length === 0) {
          this.$message({
            showClose: true,
            message: '请选择文章',
            type: 'warning'
          })
          return
        }

        const queryParams = {
          ids: this.ids,
        };

        this.$confirm('是否确认导出所选舆情数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          this.exportLoading = true;
          return exportOpinionByIds(queryParams);
        }).then(response => {
          this.download(response.msg);
          this.exportLoading = false;
        })
      },
      setForecastSigle(row, level) {
        const query = {
          ids: row.id,
          level: level
        }
        joinTheForecast(query).then(response => {
          this.$message({
            showClose: true,
            message: '预警成功',
            type: 'success'
          })
          this.getOption()
        }).catch(error => {
          this.$message({
            showClose: true,
            message: '预警失败',
            type: 'warning'
          })
        })
      },
      setForecastMultiple(level) {
        if (this.ids.length === 0) {
          this.$message({
            showClose: true,
            message: '请选择文章',
            type: 'warning'
          })
          return
        }
        const query = {
          ids: this.ids,
          level: level
        }
        joinTheForecast(query).then(response => {
          this.$message({
            showClose: true,
            message: '预警成功',
            type: 'success'
          })
          this.getOption()
        }).catch(error => {
          this.$message({
            showClose: true,
            message: '预警失败',
            type: 'warning'
          })
        })
      },
      search() {
        //重新请求
        this.getOption()
      },
      handleCheckedMediaTypeChange(value) {
        console.log("value", value)
        let checkedCount = value.length;
        this.checkAll = checkedCount === this.checks.length * 2;
        this.isIndeterminate = checkedCount > 0 && checkedCount < this.checks.length;
        //重新请求
        this.getOption()
      },
      handleCheckAllChange(val) {
        if (val) {
          this.checkList = []
          this.checks.forEach(item => {
            this.checkList.push(item.dictValue)
          })
        } else {
          this.checkList = []
        }
        this.isIndeterminate = false;
        if (!val) {
          this.$notify({
            title: '警告',
            message: '情选择舆情载体',
            type: 'warning'
          });
        }
        //重新请求
        this.getOption()
      },
      handleSizeChange(pageSize) {
        this.pageParams.pageSize = pageSize
      },
      handleCurrentChange(currentPage) {
        this.pageParams.pageNum = currentPage
        this.getOption();
      },
      handleRadioGroupChange() {
        this.getOption()
      },

      buildParam() {
        this.queryParams.eventId = this.eventId
        this.queryParams.mediaType = []
        if (this.selectEmotion === 'positive') {
          this.queryParams.ispositive = 1
          this.queryParams.isneutral = null
          this.queryParams.isnegative = null
        } else if (this.selectEmotion === 'neutral') {
          this.queryParams.ispositive = null
          this.queryParams.isneutral = 1
          this.queryParams.isnegative = null
        } else if (this.selectEmotion === 'negative') {
          this.queryParams.ispositive = null
          this.queryParams.isneutral = null
          this.queryParams.isnegative = 1
        }
        this.queryParams.timeType = this.timeType
        this.queryParams.repeatState = this.repeatState
        //选中媒体类型
        if (this.checkList.length > 0) {
          this.checkList.forEach(item => {
            this.queryParams.mediaType.push(item);
          })
        }
        //关键字
        if (this.detailInput != '') {
          this.queryParams.searchArea = this.detailSelect;
        }
        //排序
        this.queryParams.sort = this.selectSort;
        this.queryParams.keyWords = this.detailInput;
      },

      getOption() {
        this.buildParam();
        this.loading = true;
        queryByEventParameter(this.queryParams, this.pageParams).then(response => {
          this.loading = false;
          this.events = response.rows
          this.opinionTotal = response.total
          this.carrieCounts = response.custom
        })
      },

      setSensitiveInformationBySigle(row, sensitiveInformation) {
        console.log(row.id)

        if (sensitiveInformation == "删除") {
          const query = {
            ids: row.id,
            type: "exclude",
            eventId: this.eventId
          }
          this.unbind(query)
        } else {
          let query = {
            ids: row.id,
            sensitive: sensitiveInformation
          }
          this.yanpan(query)
        }

      },
      handleSelectionChange(val) {
        this.ids = []
        for (let i = 0; i < val.length; i++) {
          this.ids.push(val[i].id)
        }
      },
      yanpan: function (query) {

        updateSensitiveInformation(query).then(response => {
          this.$message({
            showClose: true,
            message: '研判成功',
            type: 'success'
          })
          this.getOption()
        }).catch(error => {
          this.$message({
            showClose: true,
            message: '研判失败',
            type: 'warning'
          })
        })
      },
      unbind: function (query) {

        unbindOpinionForEvent(query).then(response => {
          this.$message({
            showClose: true,
            message: '解除关联成功',
            type: 'success'
          })
          this.getOption()
        }).catch(error => {
          this.$message({
            showClose: true,
            message: '已解除关联',
            type: 'warning'
          })
        })
      },
      setSensitiveInformationByPelople(sensitiveInformation) {
        if (this.ids.length === 0) {
          this.$message({
            showClose: true,
            message: '请选择文章',
            type: 'warning'
          })
          return
        }

        if (sensitiveInformation == "删除") {
          const query = {
            ids: this.ids,
            type: "exclude",
            eventId: this.eventId
          }
          this.unbind(query)
        } else {
          const query = {
            ids: this.ids,
            sensitive: sensitiveInformation
          }
          this.yanpan(query)
        }
      }
    }
  }
</script>

<style scoped lang="scss">
  .titleStyle {
    text-align: justify;
    font-weight: bold;
    font-size: 18px;
  }

  .bg {
    background-color: #eeeeee;

    .avatar-shape {
      margin-top: 10px;
      margin-right: 10px;
      width: 100%;
      padding: 10px;
      background-color: #fff;
    }

    .search-shape {
      margin-top: 10px;
      padding: 10px;
      background-color: #fff;
    }

    .layout_table {
      margin-top: 10px;
      padding: 20px;
      background-color: #fff;
    }


  }

  .event-shape {
    margin-top: 10px;
    min-height: 500px;
    background-color: #fff;
  }

  .handle-nav {
    padding: 10px;
    right: 50px;
    top: 0px;
    display: flex;
    justify-content: space-between;
  }

  ::v-deep .el-collapse-item__header {
    font-weight: 700;
  }

  .title_text {
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #000;
    font-size: 16px;
  }

  .content_text {
    text-align: left;
    margin-bottom: 12px;
    color: #666;
    font-size: 14px;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
  }

</style>

<style>
  .el-divider--vertical {
    height: auto !important;
    min-height: 20px !important;
  }

  .el-radio-button {
    margin: 12px !important;
    border: none !important;
    font-size: 14px !important;
  }

  .el-radio-button__inner {
    border: none !important;
    border-radius: 4px !important;
  }

  .chart-wrapper {
    margin-top: 10px;
    width: 100%;
    margin-bottom: 0px;
  }

  .has-gutter > tr:first-child > th,
  .el-table__row td {
    border: none !important;
    vertical-align: text-bottom !important;
  }


  .box {
    background-color: white;
    margin-bottom: 10px;
  }

  .box_div {
    height: 380px;
    padding: 20px;
    font-size: 14px;
    display: flex;
    flex-direction: column;
  }


</style>
